<?php

    session_start();
    if(!isset($_SESSION['usuario'])){
            header('location:../html/login.html');
         }
         echo '<center>
                <div id="conte">
                    <table id="cabecera">
                        <tr>
                            <td align="center"> <img id="imagen" src="../imagen/BANNERSIGI.jpg" width="1258" height="125" alt="BANNERSES"/>';
                       echo"</td>
                        </tr>
                        <tr>
                            <td align=right id='sesion'><strong>Sesion:</strong>  ".$_SESSION['nombre']."";
                                echo '<a href="../../controlador/php/sql/cerrarSesion.php"><img src="../imagen/cesesion.png" title="cerrar sesion" width="20" height="20" alt="csesion" align="absbottom"/> </a>
                            </td>
                        </tr>
                        <tr>
                            <td>';
?>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title id="titulo">Reporte</title>
        <!-- Librerias jquery y hojas de estilo para creacion  del calendario -->
        <script src="js/jquery-1.9.1.min.js"></script>
        <script src="js/jquery-1.5.2.js" type="text/javascript"></script>
        <link rel="stylesheet" href="css/demos.css" type="text/css">
        <link rel="stylesheet" href="css/impresion.css" type="text/css" media="print">
        <link rel="stylesheet" href="css/jquery.ui.all.css" type="text/css">
        <script type="text/javascript" src="js/jquery.ui.core.js"></script>
        <script type="text/javascript" src="js/jquery.ui.widget.js"></script>
        <script type="text/javascript" src="js/jquery.ui.datepicker.js"></script>
        <script type="text/javascript" src="../../Ginecobstetricia/vista/js/alertify.js"></script>
	<link rel="stylesheet" href="../../Ginecobstetricia/vista/css/alertify.core.css" />
	<link rel="stylesheet" href="../../Ginecobstetricia/vista/css/alertify.default.css" />
        <link href="../../Ginecobstetricia/vista/css/bootstrap-combined.min.css" rel="stylesheet">
        <link rel="stylesheet" href="css/pestana.css" />
        <script src="js/jquery-ui.js"></script>
        <title id="titulo">Reporte</title>
<style>
            .white {
                border-radius: 5px;
                color: #606060;
                border: solid 1px #b7b7b7;
                background: #fff;
                background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
                background: -moz-linear-gradient(top,  #fff,  #ededed);
                filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
                padding: 3px 3px 3px;
                font-size: 95%;
                margin-top: -5px;
            }
            .white:hover {
                background: #ededed;
                background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
                background: -moz-linear-gradient(top,  #fff,  #dcdcdc);
                filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
            }
            .white:active {
                color: #999;
                background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
                background: -moz-linear-gradient(top,  #ededed,  #fff);
                filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
            }
</style>
<script>
    $(function() {
        $( "#tabs" ).tabs();
    });
    
    function calendario(){
         $( "#fecha1" ).datepicker({ 
         autoSize: true,
         dayNames: ['Domingo', 'Lunes', 'Martes', 'Mi?rcoles', 'Jueves', 'Viernes', 'S?bado'],
         dayNamesMin: ['Dom', 'Lu', 'Ma', 'Mi', 'Je', 'Vi', 'Sa'],
         firstDay: 1,
         monthNames: ['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'],
         monthNamesShort: ['Ene','Feb','Mar','Abr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dic'],
         dateFormat: 'dd-mm-yy',
         changeMonth: true,
         changeYear: true,
         yearRange: "-90:+0"

        });

        $( "#fecha2" ).datepicker({ 
         autoSize: true,
         dayNames: ['Domingo', 'Lunes', 'Martes', 'Mi?rcoles', 'Jueves', 'Viernes', 'S?bado'],
         dayNamesMin: ['Dom', 'Lu', 'Ma', 'Mi', 'Je', 'Vi', 'Sa'],
         firstDay: 1,
         monthNames: ['Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'],
         monthNamesShort: ['Ene','Feb','Mar','Abr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dic'],
         dateFormat: 'dd-mm-yy',
         changeMonth: true,
         changeYear: true,
         yearRange: "-90:+0"

        });
    }
    
    function medicos(){
            $.ajax({
                    type: "POST",
                    contentType: "application/x-www-form-urlencoded; charset=UTF-8",
                    url: "../../ImagenesDx/controlador/php/sql/tecnologos.php",
                    success: datosmedico
            });
        }
        
    function datosmedico(datos){
    rpt = $.parseJSON(datos);
       for(r in rpt){
          $("#medicos").append('<option value="'+ rpt[r].usu_oid +'">'+ rpt[r].nombres +'</option>');
       }   
    }
    
    function cargarAreaexa(){
           $.ajax ({
                type: "POST",
                contentType: "application/x-www-form-urlencoded; charset=UTF-8",
                url: "../../ImagenesDx/controlador/php/sql/areasexamen.php",
                success: mostrarArea
                //timeout: 4000 
        });
    }
    function mostrarArea(datos){
    rpt = $.parseJSON(datos);
       for(r in rpt){
          $("#areaE").append('<option value="'+ rpt[r].OID +'">'+ rpt[r].area_examen +'</option>');
       }   
    }
    
    function validar(){
      if ($("#medicos").val()===""){
         alertify.alert("<font size='3'>Seleccione Medico"), function () {
           $("#medicos").focus();
         };
         return false;
        }
        if ($("#areaE").val()===""){
         alertify.alert("<font size='3'>Seleccione Area Examen"), function () {
           $("#areaE").focus();
         };
         return false;
        }
       if ($("#fecha1").val()===""){
         alertify.alert("<font size='3'>Seleccione Fecha Inicial"), function () {
           $("#fecha1").focus();
         };
         return false;
        }
        if ($("#fecha2").val()===""){
         alertify.alert("<font size='3'>Seleccione Fecha Final"), function () {
           $("#fecha2").focus();
         };
         return false;
        }
        // medico();
        consultar();
    }
    function consultar(){
        var medi = $("#medicos").val();
        var area = $("#areaE").val();
        var f1 = $("#fecha1").val();
        var f2 = $("#fecha2").val();
         $.ajax ({
                type: "POST",
                contentType: "application/x-www-form-urlencoded; charset=UTF-8",
                url: "../../ImagenesDx/controlador/php/sql/reportedx.php",
                data: {medi:medi,area:area,f1:f1,f2:f2},
                success: consultarDatos
                        
                });
    }
    function consultarDatos(datos){
               $("#respuesta").text("");
                rpt = $.parseJSON(datos);
                    datos = $("#respuesta");
                    var resp = "";
                    resp += "<table style='align:center; overflow:hidden;border:1px solid #d3d3d3;background:#e8eaeb;width:50%;-moz-border-radius:5px; /* FF1+ */-webkit-border-radius:5px; /* Saf3-4 */border-radius:5px;-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);'>\
                                <tr>\
                                    <td style='text-align:center'>\
                                        <b>CANTIDAD\
                                    </td>\
                                    <td style='text-align:center'>\
                                        <b>ESPECIALIDAD\
                                    </td>\
                                </tr> ";
                    var con = 1;
                     for(dat in rpt){
                        var fecha1 = $("#fecha1").val();
                        var fecha2 = $("#fecha2").val();
                        document.getElementById("med").innerHTML = '<i><b><font size=2 style="text-transform:uppercase">EXAMENES TOMADOS POR: '+rpt[dat].nombres +'<BR>DESDE EL '+fecha1 + ' HASTA EL '+fecha2+'<BR><BR>';
                               resp += "<tr>\
                                    <td style='padding:10px 10px 10px; text-align:center;border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));'>\
                                       "+rpt[dat].N+"\
                                    </td>\
                                    <td style='padding:10px 10px 10px; text-align:center;border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));'>\
                                        "+rpt[dat].GASNOMBRE+"\
                                    </td>\
                                 </tr>";
                   con++;
                   } 
                   resp += "</table>";
                   datos.append(resp);
                }
      
   
   function imprimir(){
       var ficha=document.getElementById('contenido');
       var ventimp=window.open(' ','popimpr');
       ventimp.document.write(ficha.innerHTML);
       ventimp.document.close();
       ventimp.print();
       ventimp.close();
   }
   
   $(document).ready(function() {
        $(".botonExcel").click(function(event) {
            $("#datos_a_enviar").val( $("<div>").append( $("#contenido").eq(0).clone()).html());
            $("#FormularioExportacion").submit();
        });
    });
</script>
</head>     
<body onload="calendario();medicos();cargarAreaexa();">
    <div id="tabs">
        <ul>
            <li><a href="#tabs-1">Reportes</a></li>
        </ul>
   <div id="tabs-1">
            <table id="tabl" >
                <tr>
                    <td align="center" colspan="2">
                        <strong>Reporte Imagenes Diagnosticas</strong>
                    </td>
                </tr>
                <tr>
                    <td align="center" >
                        Medico Asignado:
                    </td>
                    <td>
                        <select id="medicos" name="cbmedicos" style="width: 130px;height:25px;text-transform:uppercase" >
                           <option value="">---</option>
                       </select>
                    </td>
                </tr>
                <!--<tr>
                    <td align="center" >
                        Area Examen:
                    </td>
                    <td>
                        <select id="areaE" name="cbticon" style="width: 130px;height:25px;">
                           <option value="">---</option>
                       </select>
                    </td>
                </tr>-->
                <tr>
                    <td align="center" >
                        Fecha Inicial:
                    </td>
                    <td>
                        <input type="text" name="" value="" id="fecha1" style="width: 130px;height:25px;"/>
                    </td>
                </tr>
                <tr>
                    <td align="center" >
                        Fecha Final:
                    </td>
                    <td>
                        <input type="text" name="" value="" id="fecha2" style="width: 130px;height:25px;"/>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" >
                        <input type="button" value="Generar" class="white" onclick="validar();"/>
                    </td>
                </tr>
            </table>
            <table width="100%">
                <tr>
                    <tr>
                        <td width="3%" >
                            <form action="../../controlador/php/sql/excel.php" method="post" target="_blank" id="FormularioExportacion">
                                <img title="generar en excel" src="../imagen/excel.png" width="30" height="30" class="botonExcel" />
                                <input type="hidden" id="datos_a_enviar" name="datos_a_enviar" />
                            </form>
                        </td>
                        <td  align="absbottom" >
                            <a>
                                <img title="imprimir" border="0" src="../imagen/imprimir.png" width="35" height="35" onclick="imprimir();">
                            </a>

                        </td>
                    <td align="right">
                        <img style="cursor: pointer;" title="atras" src="../imagen/atras.png" width="30" height="30" alt="atras" onclick="window.history.back();"/>
                    </td>
                </tr>
            </table>
       </div>
    </div>
    <br><br>
    <div id="contenido">
    <div align="center" id="med"></div>
    <div id="respuesta" align="center" ></div>
    </div>
</body>
</html>